<template>
  <div>
    <div style="width:10%">
      <h3>新专业申请查看</h3>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
    </div>
    <div style="width:80%">
      <h4 style="float: left">新专业申请列表</h4>
      <Button id="b1" @click="newMajor()">申请新专业</Button>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
    </div>
    <Table border :columns="columnshead" :data="MajorList">
      <template slot-scope="{ row,index }" slot="Action">
        <Button id="b2" size="small" @click="check(index)">审核</Button>
      </template>
    </Table>
    <br>
    <div style="margin: 10px;overflow: hidden">
      <div style="float: right">
        <Page :total="total" :current="1" show-elevator show-total @on-change="changePage"></Page>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        columnshead: [{
            title: '学校',
            key: 'scId'
          },
          {
            title: '专业编码',
            key: 'nmId'
          },
          {
            title: '专业名称',
            key: 'nmdName'
          },
          {
            title: '专业申请日期',
            key: 'nmdApplydate'
          },
          {
            title: '专业审核意见',
            key: 'nmdApprovalopi'
          },
          {
            title: '专业审核时间',
            key: 'nmdApprovaldate'
          },
          {
            title: '审核人',
            key: 'nmdApprover'
          },
          {
            title: '状态',
            key: 'nmdState'
          },
          {
            title: '审核操作',
            slot: 'Action'
          }
        ],
        MajorList: [],
        total: 1
      }
    },
    created() {
      this.$axios.get(this.$host + '/professional/declaration/allNewMajorDeclaration?pageNum=1&&pageSize=10').then(res => {
        console.log(res)
        this.total = res.data.data.total
        this.MajorList = res.data.data.list
      })
    },
    methods: {
      newMajor() {
        this.$router.push({
          name: 'NewMajorDeclaration'
        })
      },
      check(index) {
        this.$router.push({
          name: 'NewMajorCheck',
          query: {
            nmList: this.MajorList[index]
          }
        })
      },
      changePage (currentPage) {
        this.$axios.get(this.$host + '/professional/declaration/allNewMajorDeclaration?pageNum=' + currentPage +
          '&&pageSize=10').then(res => {
          this.MajorList = res.data.data.list
        })
      },
    }
  }
</script>

<style scoped>
  h3 {
    font-size: 1.75rem;
    float: left;
  }

  #b1 {
    float: right;
    background-color: burlywood;
  }

  #b2 {
    background-color: cadetblue;
  }

  #b3 {
    float: right;
    background-color: darksalmon;
  }
</style>
